UserCSS - 於行動版時移動新增文章鍵至右下角
/noratetsu/●newボタンをフローティングボタン風にする
UserCSS
code:style.css
@media screen and (max-width: 768px) {
/* newボタンの位置を変更する */
.new-button {
position: fixed;
z-index: 1000; /* 最前面に表示 */
bottom: 5vh;
right: 10vw; /* leftにすると左下になる */
width: 50px;
height: 50px;
box-shadow: 0px 0px 10px rgba(0,0,0,0.4);
}
/* デフォルトの十字マークを非表示にする */
.new-button .horizontal-line,
.new-button .vertical-line {
display: none;
}
/* 十字マークを設定する */
.new-button::after {
display: block;
position: absolute;
font-family: 'Font Awesome 5 Free';
content: ' \f067';
font-weight: 900; /* 必須 */
font-size: 45px;
color: var(--new-button-vertical-color, #fff);
/* 中央配置 */
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
}
}